{{=$wz::action('header', 'static');}}

<!-- BEGIN PAGE CONTAINER -->
        <section id="maincontainer">
        
            <!-- BEGIN PAGE HEADER (NORMAL) -->
            <div id="fixed_page header" >
                
                <div class="fixed_page head">
                    <h1>_("Ajouter un contact")_<span class="tools">
                            <ul class="buttonlist">
                                <li><a href="{{=$wz::urlizer('contacts')}}" class="icon roundarrowleft16 tooltip" title="_("Retour à la liste des contacts")_">_("Retour à la liste des contacts")_</a></li>
                            </ul>
                        </span></h1>
                </div> <!-- end div .fixed_page.head -->
                
            </div>
            <!-- END PAGE HEADER (NORMAL) -->
            
			<!-- BEGIN BREADCRUMB (NORMAL) -->
			<!--div class="fixed_page breadcrumb">
				<ul class="pagewrap">
					<li><a href="dashboard.html">Dashboard</a></li>
					<li>Calendar</li>
				</ul>                                   
			</div--><!-- end div .fixed_page.breadcrumb -->
			<!-- END BREADCRUMB (NORMAL) -->
                
			<!-- BEGIN PAGE CONTENT (NORMAL)  -->
			<div class="fixed_page content">	
                <form action="{{=$wz::urlizer('addContact')}}" method="post" id="addContactForm">
                <div class="grid_16 alpha box">
					<div class="header">_("Données personnelles")_</div>
                    
					<div class="toggle_container">					
						<div class="block">				  
								<fieldset id="civilite">
									<label>_("Civilité")_</label>
									<div>
										<div class="jqui_radios ui-buttonset">
											<input type="radio" id="monsieur" name="genre" class="ui-helper-hidden-accessible" />
											<label for="monsieur" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left ui-state-active" role="button" aria-disabled="false"><span class="ui-button-text">_("Monsieur")_</span></label>
											<input type="radio" id="madame" name="genre" class="ui-helper-hidden-accessible" />
                                            <label for="madame" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" aria-pressed="false" role="button" aria-disabled="false"><span class="ui-button-text">_("Madame")_</span></label>
                                            <input type="radio" id="mademoiselle" name="genre" class="ui-helper-hidden-accessible" />
                                            <label for="mademoiselle" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" aria-pressed="false" role="button" aria-disabled="false"><span class="ui-button-text">_("Mademoiselle")_</span></label>
										</div>
									</div>
								</fieldset>
                                <fieldset id="nom">
									<label>_("Nom")_</label>
									<div>
										<input type="text" id="name" name="name" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="prenom">
									<label>_("Prénom")_</label>
									<div>
										<input type="text" id="firstname" name="firstname" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="nomJeuneFille" class="hidden">
									<label>_("Nom de jeune fille")_</label>
									<div>
										<input type="text" id="maidenName" name="maidenName" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="adresse">
                                    <label>_("Adresse")_</label>
									<div>
										<textarea class="long textarea" id="address" name="address"></textarea>
									</div>
                                </fieldset>
                                <fieldset id="cp">
									<label>_("Code postal")_</label>
									<div>
										<input type="text" id="zip" name="zip" class="small text"/>
									</div>
								</fieldset>
                                <fieldset id="ville">
									<label>_("Ville")_</label>
									<div>
										<input type="text" id="city" name="city" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="telFixe">
									<label>_("Tél. domicile")_</label>
									<div>
										<input type="text" id="homeTel" name="homeTel" class="medium text"/>
									</div>
								</fieldset>
                                <fieldset id="telMobile">
									<label>_("Tél. portable")_</label>
									<div>
										<input type="text" id="cellTel" name="cellTel" class="medium text"/>
									</div>
								</fieldset>
                                <fieldset id="telPro">
									<label>_("Tél. pro.")_</label>
									<div>
										<input type="text" id="workTel" name="workTel" class="medium text"/>
									</div>
								</fieldset>
                                <fieldset id="emailPerso">
									<label>_("Email perso")_</label>
									<div>
										<input type="text" id="emailPerso" name="emailPerso" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="emailPro">
									<label>_("Email pro.")_</label>
									<div>
										<input type="text" id="emailPro" name="emailPro" class="long text"/>
									</div>
								</fieldset>
                                <fieldset id="dateNaissance">
									<label>_("Date de naissance")_</label>
									<div>
										<input type="text" class="datepicker" id="birthdate" name="birthdate" style="width: 100px;"> 
									</div>

								</fieldset>
						</div>
					</div>
				</div>
                <div class="grid_16 alpha box">
					<div class="header">_("Données professionnelles")_</div>
                    
					<div class="toggle_container">					
						<div class="block">
							&nbsp;
						</div>
					</div>
				</div>
                <div class="grid_16 alpha box">
					<div class="header">_("Données financières")_</div>
                    
					<div class="toggle_container">					
						<div class="block">
							&nbsp;
						</div>
					</div>
				</div>
                <div class="grid_16 alpha box">
					<div class="header">_("Données RDV")_</div>
                    
					<div class="toggle_container">					
						<div class="block">
							<fieldset id="validation">
                                <label>_("Validation")_</label>
                                <div>
                                    <button class="button blue" type="submit"> 
                                        <img src="{{=URL_SITE}}images/icons/white/png/checkmark_icon&amp;16.png" /> _("Ajouter")_ 
                                    </button>
                                    <button class="button green" type="reset"> 
                                        <img src="{{=URL_SITE}}images/icons/white/png/brush_icon&amp;16.png" /> _("Annuler")_ 
                                    </button>
                                </div>
                            </fieldset>
						</div>
					</div>
				</div>
            	<div class="clear"></div><!-- CLEAR BOTH -->
                </form>
			</div><!-- end div .fixed_page.content -->
			<!-- END PAGE CONTENT (NORMAL) -->
        
        </section><!-- end section .maincontainer -->
        <!-- END PAGE CONTAINER -->
        <!-- BEGIN JAVASCRIPTS FOR THIS PAGE --> 
        <script type="text/javascript">
            $("#addContactForm").validate({
			rules: {
				name: {
					required: true,
					minlength: 3
				},
				emailPerso: {
					email: true
				},
				firstname: {
					required: true,
					minlength: 3
				}
			}
		});
        $(document).ready(function() {
                $('#madame').click(
                    function()
                    {
                        $('#nomJeuneFille').show();
                    }
                );
                $('#mademoiselle').click(
                    function()
                    {
                        $('#nomJeuneFille').hide();
                    }
                );
                $('#monsieur').click(
                    function()
                    {
                        $('#nomJeuneFille').hide();
                    }
                );
            });
        </script>
    <!-- END JAVASCRIPTS FOR THIS PAGE --> 
{{=$wz::action('footer', 'static');}}